import _ from 'lodash';
//引入样式表
import './css/style.css';
//导入图片 返回的时一个url地址
import ImgURL from './images/page4-img5.jpg';
import starURL from './images/star.png';

function component() {
    console.log("aaaa");
    let num = 10;
    const element = document.createElement('div');
    const btnElement = document.createElement('button');
    btnElement.innerHTML="点击我文件变颜色";
    // lodash（目前通过一个 script 引入）对于执行这一行是必需的
    // lodash 在当前 script 中使用 import 引入
    element.innerHTML = _.join(['Hello', 'webpack'], '----');
    //element.innerHTML ="hello----webpack"
    //给按钮绑定一个点击事件
    btnElement.onclick= ()=>{
        element.classList.add('hello');
    }
    element.appendChild(btnElement);
     // 将图像添加到我们已经存在的 div 中。
    const myIcon1 = new Image();
    myIcon1.src = ImgURL;
    const myIcon2 = new Image();
    myIcon2.src = starURL;
    //把图片添加在div中
    element.appendChild(myIcon1);
    element.appendChild(myIcon2);
    //把按钮添加div元素中
    return element;
  }
  
  document.body.appendChild(component());